<template>
	<hearder :title="title"></hearder>
	<view style="width: 90%;margin: auto;margin-top: 50rpx;font-size: 30rpx;border-radius: 15rpx;border: 2px solid #eeeeee;border-radius: 15rpx;
	overflow: hidden;height: 500rpx;">
			<van-field v-model="add.name" label="姓名:" />
			<van-field v-model="date" @click="getDates()" label="当前时间:" />
			<!-- <view class="">
				<text>当前时间：</text>
			</view>
			 -->
			<van-field style="height: 350rpx;"
			    v-model="add.content"
			    rows="2"
			    autosize
			    label="工作内容:"
			    type="textarea"
			    maxlength="200"
			    placeholder="请输入工作内容"
			    show-word-limit
			  />
			
	</view>
	<van-button style="background-color: #49A0FF;color: white;width: 70%;border-radius: 50rpx;height: 70rpx;
	margin-left: 110rpx;margin-top: 40rpx;font-size: 26rpx;" @click="addList()">提交</van-button>
	
	<van-popup style="border-radius: 20rpx 20rpx 0 0rpx" v-model:show="dateShow" position="bottom" :overlay="false">
	<van-picker-group style="border: 1px solid #eeeeee;"  title="" :tabs="['选择日期', '选择时间']" @confirm="onConfirm" @cancel="onCancel">
				<van-date-picker v-model="currentDate" :min-date="minDate" :max-date="maxDate" />
				<van-time-picker v-model="currentTime" :columns-type="columnsType"/>
			</van-picker-group>
				</van-popup>
</template>

<script>
	import hearder from '../../components/header_back/header_back.vue'
	export default {
		components: {
			hearder
		},
		data() {
			return {
				add: {
				
					date: '',
					time:'',
					content: '',
					name: '',
				},
				date:'',
				title:'添加',
				currentDate:['2022', '06', '01'],
				currentTime:['12', '00','00'],
				dateShow:false,
				columnsType : ['hour', 'minute', 'second'],
			};
		},
		methods:{
			getDates(){
				this.dateShow=true
			},
			onCancel(){
				
				this.dateShow=false
			},
			onConfirm(){
				this.currentDate[0]=this.currentDate[0]+'年'
				if(this.currentDate[1]<"10"){
					if(this.currentDate[1]=="09"){
						this.currentDate[1]="9月"
					}else if(this.currentDate[1]=="08"){
						this.currentDate[1]="8月"
					}else if(this.currentDate[1]=="07"){
						this.currentDate[1]="7月"
					}else if(this.currentDate[1]=="06"){
						this.currentDate[1]="6月"
					}else if(this.currentDate[1]=="05"){
						this.currentDate[1]="5月"
					}else if(this.currentDate[1]=="04"){
						this.currentDate[1]="4月"
					}else if(this.currentDate[1]=="03"){
						this.currentDate[1]="3月"
					}else if(this.currentDate[1]=="02"){
						this.currentDate[1]="2月"
					}else if(this.currentDate[1]=="01"){
						this.currentDate[1]="1月"
					}
				}else if(this.currentDate[1]>="10"){
					this.currentDate[1]=this.currentDate[1]+'月'
				}
				
				if(this.currentDate[2]<"10"){
					if(this.currentDate[2]=="09"){
						this.currentDate[2]="9日"
					}else if(this.currentDate[2]=="08"){
						this.currentDate[2]="8日"
					}else if(this.currentDate[2]=="07"){
						this.currentDate[2]="7日"
					}else if(this.currentDate[2]=="06"){
						this.currentDate[2]="6日"
					}else if(this.currentDate[2]=="05"){
						this.currentDate[2]="5日"
					}else if(this.currentDate[2]=="04"){
						this.currentDate[2]="4日"
					}else if(this.currentDate[2]=="03"){
						this.currentDate[2]="3日"
					}else if(this.currentDate[2]=="02"){
						this.currentDate[2]="2日"
					}else if(this.currentDate[2]=="01"){
						this.currentDate[2]="1日"
					}
				}else if(this.currentDate[2]>="10"){
					this.currentDate[2]=this.currentDate[2]+'日'
				}
				this.currentTime[0]=this.currentTime[0]+':'
				this.currentTime[1]=this.currentTime[1]+':'
				this.date=this.currentDate[0]+this.currentDate[1]+this.currentDate[2]+this.currentTime[0]+this.currentTime[1]+this.currentTime[2]
				// console.log(this.date)
				this.dateShow=false
			}
		}
	}
</script>

<style lang="scss">
page{
	background-color: rgb(247,247,247);
}
</style>
